// 背景对象构造函数
var backgroundObj = function() {
    this.x = []; // 背景元素的x坐标数组
    this.y = []; // 背景元素的y坐标数组
    this.w = []; // 背景元素的宽度数组
    this.h = []; // 背景元素的高度数组
    this.isLive = []; // 背景元素是否存活的布尔值数组
}

// 设置背景对象的元素数量
backgroundObj.prototype.num = 3;

// 初始化背景对象
backgroundObj.prototype.init = function() {
    for (var i = 0; i < this.num; i++) {
        if (i == 0) {
            // 第一个元素的x坐标随机生成
            this.x[i] = canWidth * 0.1 * Math.random();
        } else {
            // 其他元素的x坐标基于前一个元素的位置生成
            this.x[i] = this.x[i - 1] + this.w[i - 1] + canWidth * 0.2 * i * Math.random();
        }
        // 随机生成宽度和高度
        this.w[i] = canWidth * 0.08 + canHeight * Math.random() * 0.3;
        this.h[i] = canHeight * 0.08 + canWidth * Math.random() * 0.3;
        // 随机生成y坐标
        this.y[i] = canHeight * 0.2 * Math.random();
        // 设置元素为存活状态
        this.isLive[i] = true;
    }
}

// 生成新的背景元素
backgroundObj.prototype.cloudBorn = function() {
    for (var i = 0; i < this.num; i++) {
        if (!this.isLive[i]) {
            // 随机生成新的宽度和高度
            this.w[i] = canWidth * 0.08 + canWidth * Math.random() * 0.3;
            this.h[i] = canHeight * 0.08 + canHeight * Math.random() * 0.3;
            this.y[i] = canHeight * 0.2 * Math.random();
            if (i == 0) {
                // 第一个元素的x坐标设置为画布宽度
                this.x[i] = canWidth;
            } else {
                // 其他元素的x坐标基于前一个元素的位置生成
                this.x[i] = canWidth + i * this.w[i - 1];
            }
            // 设置元素为存活状态
            this.isLive[i] = true;
        }
    }
}

// 绘制背景元素
backgroundObj.prototype.draw = function() {
    // 清除画布
    ctx1.clearRect(0, 0, canWidth, canHeight);
    ctx1.save();
    for (var i = 0; i < this.num; i++) {
        if (this.isLive[i]) {
            // 更新元素的x坐标
            this.x[i] -= 0.1 * totalSpeed;
            // 设置填充颜色
            ctx1.fillStyle = "#ffffff";
            // 绘制多个圆形来模拟云朵形状
            ctx1.beginPath();
            ctx1.arc(this.x[i] + this.w[i] * 0.4, this.y[i] + this.h[i] * 0.1, Math.max(this.h[i], this.w[i]) * 0.15, 0, Math.PI * 2, true);
            ctx1.fill();
            // ... 继续绘制其他圆形 ...
            ctx1.closePath();
            ctx1.fill();
        }
        // 如果元素移出画布，设置为不存活状态
        if (this.x[i] + this.w[i] < 0) {
            this.isLive[i] = false;
        }
    }
    ctx1.restore();
    // 调用生成新元素的方法
    this.cloudBorn();
}